<template>
  <div class="paysuccess">
    <img src="../../../public/images/pay.svg" class="image_232X1">
    <p class="text_962X1">支付成功</p>
    <p class="text_950X1">luckincoffee瑞幸咖啡</p>
    <p class="text_959X1">￥{{ BuyNumber.money }}</p>
    <p class="text_952X1" @click="goBuySuccess">返回商家</p>
    <van-checkbox v-model="checked" shape="square">关注luckincoffee瑞幸咖啡</van-checkbox>


  </div>
</template>

<script setup>
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useBuyNumber } from '@/store/discountCoupon.js'
const BuyNumber = useBuyNumber()
const router = useRouter()

const money = ref(21.01)
const checked = ref(true)

// 跳转到购买成功
const goBuySuccess = () => router.push('buysuccess')



</script>

<style lang="scss" scoped>
.paysuccess {

	background-color: #fff;
	height: 100vh;

.image_232X1{
	width: 40px;
	height: 40px;
	margin-left: 168px;
	margin-top: 75px;
}

.text_962X1{
	width: 72px;
	height: 27px;
	margin-left: 152px;
	top: 118px;
	color: rgba(112, 198, 125, 1);
	font-size: 18px;
	line-height: 150%;
	text-align: left;
}
.text_950X1{
	width: 163px;
	height: 25px;
	margin-left: 120px;
	margin-top: 66px;
	color: rgba(56, 56, 56, 1);
	font-size: 17px;
	line-height: 150%;
	text-align: left;
}

.text_959X1{
	width: 102px;
	height: 57px;
	margin-left: 125px;
	margin-top: 15px;
	color: rgba(56, 56, 56, 1);
	font-size: 38px;
	line-height: 150%;
	text-align: left;
	font-weight: bold;
}

.text_952X1{
	width: 165px;
	height: 34px;
	margin-left: 105px;
	margin-top: 230px;
	color: rgba(112, 198, 125, 1);
	box-shadow: rgba(112, 198, 125, 1) solid 1px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 34px;
	text-align: center;
  border: 1px solid rgba(112, 198, 125, 1);
}

.van-checkbox {
  width: 200px;
	height: 19px;
	margin-left: 100px;
	margin-top: 35px;
	color: rgba(217, 217, 217, 1);
	font-size: 14px;
	line-height: 150%;
	text-align: left;
}
}

</style>